﻿@page "/heatmap-chart/default-functionalities"

@using Syncfusion.Blazor.HeatMap
@using sf_blazor_heatmapdata
@inherits SampleBaseComponent;

<SampleDescription>
    <p>This sample visualizes the sales revenue of items sold by the employees in a week, where the revenue for the day is displayed in 1000 USD as cell data. </p>
</SampleDescription>
<ActionDescription>
    <p>In this example, you can see how to render a Heatmap with the provided DataSource. The Palette color is applied to the items in Heatmap. The default Legend is enabled in this example to represent the items.</p>
    <p>Tooltip is enabled in this example. To see the Tooltip in action, hover the mouse over an item or tap an item in touch enabled devices.</p>
</ActionDescription>

<div class="control-section">
    <div class="row">
        <div class="col-md-12">
            <SfHeatMap DataSource="@DataSource">
                <HeatMapXAxis Labels="@XLabels"></HeatMapXAxis>
                <HeatMapYAxis Labels="@YLabels"></HeatMapYAxis>
                <HeatMapTitleSettings Text="Sales Revenue per Employee (in 1000 US$)"></HeatMapTitleSettings>
            </SfHeatMap>
        </div>
    </div>
</div>

@code{
    string[] XLabels = new string[] { "Nancy", "Andrew", "Janet", "Margaret", "Steven", "Michael", "Robert", "Laura", "Anne", "Paul", "Karin", "Mario" };
    string[] YLabels = new string[] { "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" };
    int[,] DataSource = HeatMapData.GetDefaultData();
}